<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8" />
    <title>xz2000's Testbed</title>

    <style>
    .body {
      font-family: Arial, Helvetica, sans-serif;
    }

    .footer {
      width: 100%;
      background-color: rgb(193, 210, 243);
      position: fixed;
      bottom: 0;
    }

    .header {
      width: 100%;
      background-color: rgb(193, 210, 243);
      position: fixed;
      top: 0;
    }

    .errorbtn {
      margin: 10px;
      margin-top: 20px;
      margin-bottom: 20px;
      width: 90%;
      padding: 10px;
      border-radius: 10px;
      border-color: rgb(106, 21, 21);
      border-style: solid;
      font-size: 18px;
      color: rgb(106, 21, 21);
      background-color: rgb(241, 230, 230);
      outline-color: rgb(106, 21, 21);
      user-select: text;
    }
    
    .largebtn {
      margin: 10px;
      margin-top: 20px;
      margin-bottom: 20px;
      width: 90%;
      padding: 10px;
      border-radius: 10px;
      border-color: rgb(40, 76, 143);
      border-style: solid;
      font-size: 18px;
      color: rgb(40, 76, 143);
      background-color: rgb(230, 234, 241);
      outline-color: rgb(40, 76, 143);
      user-select: text;
    }

    .largebtn:hover {
      margin: 10px;
      margin-top: 20px;
      margin-bottom: 20px;
      width: 90%;
      padding: 10px;
      border-radius: 10px;
      border-color: rgb(40, 76, 143);
      border-style: solid;
      font-size: 18px;
      color: rgb(255, 255, 255);
      background-color: rgb(40, 76, 143);
      outline-color: rgb(40, 76, 143);
      user-select: text;
    }

    </style>
  </head>
  <body class="body" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    <div class="header" style="background-color: rgb(193, 210, 243);padding: 20px;">
        <p1 style="font-size: xx-large;font-weight: bold;color: rgb(23, 43, 126)">Testbed</p1>
    </div>
    <!-- <br>
    <a href="http://xz2000.cn" style="padding: 20px;color: rgb(36, 22, 191);font-size: 20px;">本站域名  http://xz2000.cn</a> -->
    <div style="margin: 20px;text-align: center; margin-top: 100px; margin-bottom: 80px;">
      {% for (name, url) in urls %}
          <!-- <div>
              <p2 style="font-size: 20px;font-weight: bold;">{{ name }}:</p2>
              <a style="font-size: 20px;" href="{{ url }}">{{ url }}
              </a>
          </div>
          <br> -->
          {% if url != '服务中断' %}
          <div>
            <button type="button" class="largebtn" onclick=" window.open('{{ url }}','_blank')">{{ name }}: {{ url }}</button>
          </div>
          {% else %}
          <div>
            <button type="button" class="errorbtn">{{ name }}: {{ url }}</button>
          </div>
          {% endif %}
      {% endfor %}
    </div>
  </body>

  <div class="footer" style="padding: 20px;text-align: center;">
    <a href="https://beian.miit.gov.cn/" target="_blank" style="padding: 20px;color: rgb(23, 43, 126);">赣ICP备19013639号-2</a>
  </div>
</html>
